<div id="content_header">
  <h3>Class Information</h3>
</div>

<div class="row">
  
  <div class="col-xs-12 col-sm-12 col-md-12 col-lg-9">
    <h4>Registered Students</h4>
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 table-responsive">
        <div ng-if="registered.length < 1">
          No Registered Student
        </div>
        <table class="table table-striped table-hover" ng-if="registered.length > 0">
          <thead>
            <tr>
              <th></th>
              <th>#</th>
              <th>Name</th>
              <th>SID</th>
              <th>Phone</th>
              <th>Latest PT</th>
              <th>New Student?</th>
              <th></th>
            </tr>
          </thead>
          <tbody>
            <!-- <tr dir-paginate="enrollment in enrollments | itemsPerPage: pagesize" total-items="totalItems"> -->
            <tr ng-repeat="enrollment in registered">
              <td><input type="checkbox" ng-checked="checkSelected(enrollment.Id)" ng-click="toggleRefund(enrollment)"></td>
              <td>{{ $index+1 }}</td>
              <td><a href ui-sref="students.show({ id: enrollment.Student.Id })">{{ enrollment.Student.FullName }}</a></td>
              <td>{{ enrollment.Student.SID }}</td>
              <td>{{ enrollment.Student.Phone }}</td>
              <td>
                <span ng-if="enrollment.student.LatestPlacementTest">
                  {{ enrollment.student.LatestPlacementTest.DateTime  | date:'medium' }}{{ (enrollment.student.LatestPlacementTest.CourseLevel)? '/'+enrollment.student.LatestPlacementTest.CourseLevel.Name : '' }}
                </span>
                <span ng-if="!enrollment.student.LatestPlacementTest">
                  -
                </span>
              </td>
              <td>
                <span class="label label-default" ng-if="enrollment.IsNewStudent !== true">No</span>
                <span class="label label-success" ng-if="enrollment.IsNewStudent === true">Yes</span>
              </td>
              <td>
                <div class="btn-group pull-right">
                  <button type="button" class="btn btn-default dropdown-toggle btn-xs" data-toggle="dropdown">
                    Action <span class="caret"></span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <li ng-if="enrollment.IsRefundable"><a href ng-click="cancelClass(enrollment.RefundType, enrollment)">Cancel Class</a></li>
                    <li><a href ng-click="cancelClass(enrollment)">Cancel Class</a></li>
                    <li><a href ng-click="moveClass(enrollment)">Move CLass</a></li>
                    <li ng-if="enrollment.CourseCompletionStatus === 9"><a href ui-sref="mt.new({id: enrollment.Id})">MUT</a></li>
                    <li><a href ui-sref="students.individual({id: enrollment.Id})">Report</a></li>
                  </ul>
                </div>
              </td>
            </tr>
          </tbody>
        </table>
        <!-- <dir-pagination-controls on-page-change="pageChanged(newPageNumber)" template-url="views/templates/dirPagination.tpl.html"></dir-pagination-controls> -->
      </div>
    </div>
    <div class="row">
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
        <button type="button" class="btn btn-default" ng-click="cancelClassBatch()" ng-disabled="selectedEnrollments.length < 1">Cancel</button>
      </div>
      <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
        <button type="button" class="btn btn-default" ng-click="moveClassBatch()" ng-disabled="selectedEnrollments.length < 1">Move</button>
      </div>
    </div>

    <br>
    <br>

    <h4>Waiting List</h4>
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-10 table-responsive">
        <div ng-if="waitingList.length < 1">
          Waiting List is Empty
        </div>
        <table class="table table-striped table-hover" ng-if="waitingList.length > 0">
          <thead>
            <tr>
              <th></th>
              <th>Name</th>
              <th>SID</th>
              <th>Phone</th>
              <th>Latest PT</th>
              <th>New Student?</th>
              <th></th>
            </tr>
          </thead>
          <tbody>
            <!-- <tr dir-paginate="enrollment in enrollments | itemsPerPage: pagesize" total-items="totalItems"> -->
            <tr ng-repeat="enrollment in waitingList">
              <td>{{ $index+1 }}</td>
              <td><a href ui-sref="students.show({ id: enrollment.Student.Id })">{{ enrollment.Student.FullName }}</a></td>
              <td>{{ enrollment.Student.SID }}</td>
              <td>{{ enrollment.Student.Phone }}</td>
              <td>
                <span ng-if="enrollment.student.LatestPlacementTest">
                  {{ enrollment.student.LatestPlacementTest.DateTime  | date:'medium' }}{{ (enrollment.student.LatestPlacementTest.CourseLevel)? '/'+enrollment.student.LatestPlacementTest.CourseLevel.Name : '' }}
                </span>
                <span ng-if="!enrollment.student.LatestPlacementTest">
                  -
                </span>
              </td>
              <td>
                <span class="label label-default" ng-if="enrollment.IsNewStudent !== true">No</span>
                <span class="label label-success" ng-if="enrollment.IsNewStudent === true">Yes</span>
              </td>
              <td>
                <div class="btn-group pull-right">
                  <button type="button" class="btn btn-default dropdown-toggle btn-xs" data-toggle="dropdown">
                    Action <span class="caret"></span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <!-- <li><a href ng-click="cancelClass(enrollment.RefundType, enrollment)">Cancel Class</a></li> -->
                    <!-- <li><a href ng-click="moveClass(enrollment.RefundType, enrollment)">Move CLass</a></li> -->
                    <li ng-if="enrollment.CourseCompletionStatus === 9"><a href ui-sref="mt.new({id: enrollment.Id})">MUT</a></li>
                    <li><a href ui-sref="students.individual({id: enrollment.Id})">Report</a></li>
                  </ul>
                </div>
              </td>
            </tr>
          </tbody>
        </table>
        <!-- <dir-pagination-controls on-page-change="pageChanged(newPageNumber)" template-url="views/templates/dirPagination.tpl.html"></dir-pagination-controls> -->

      </div>
    </div>

    <br>
    <br>

    <h4>Cancel/Move</h4>
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-10 table-responsive">
        <div ng-if="cancelled.length < 1">
          Cancel/Move is Empty
        </div>
        <table class="table table-striped table-hover" ng-if="cancelled.length > 0">
          <thead>
            <tr>
              <th></th>
              <th>Name</th>
              <th>SID</th>
              <th>Phone</th>
              <th>Latest PT</th>
              <th>New Student?</th>
              <th></th>
            </tr>
          </thead>
          <tbody>
            <!-- <tr dir-paginate="enrollment in enrollments | itemsPerPage: pagesize" total-items="totalItems"> -->
            <tr ng-repeat="enrollment in cancelled">
              <td>{{ $index+1 }}</td>
              <td><a href ui-sref="students.show({ id: enrollment.Student.Id })">{{ enrollment.Student.FullName }}</a></td>
              <td>{{ enrollment.Student.SID }}</td>
              <td>{{ enrollment.Student.Phone }}</td>
              <td>
                <span ng-if="enrollment.student.LatestPlacementTest">
                  {{ enrollment.student.LatestPlacementTest.DateTime  | date:'medium' }}{{ (enrollment.student.LatestPlacementTest.CourseLevel)? '/'+enrollment.student.LatestPlacementTest.CourseLevel.Name : '' }}
                </span>
                <span ng-if="!enrollment.student.LatestPlacementTest">
                  -
                </span>
              </td>
              <td>
                <span class="label label-default" ng-if="enrollment.IsNewStudent !== true">No</span>
                <span class="label label-success" ng-if="enrollment.IsNewStudent === true">Yes</span>
              </td>
              <td>
                <div class="btn-group pull-right">
                  <button type="button" class="btn btn-default dropdown-toggle btn-xs" data-toggle="dropdown">
                    Action <span class="caret"></span>
                  </button>
                  <ul class="dropdown-menu" role="menu">
                    <!-- <li><a href ng-click="cancelClass(enrollment.RefundType, enrollment)">Cancel Class</a></li> -->
                    <!-- <li><a href ng-click="moveClass(enrollment.RefundType, enrollment)">Move CLass</a></li> -->
                    <li ng-if="enrollment.CourseCompletionStatus === 9"><a href ui-sref="mt.new({id: enrollment.Id})">MUT</a></li>
                    <li><a href ui-sref="students.individual({id: enrollment.Id})">Report</a></li>
                  </ul>
                </div>
              </td>
            </tr>
          </tbody>
        </table>
        <!-- <dir-pagination-controls on-page-change="pageChanged(newPageNumber)" template-url="views/templates/dirPagination.tpl.html"></dir-pagination-controls> -->

      </div>
    </div>

  </div>

  <div class="col-xs-12 col-sm-12 col-md-12 col-lg-3">
    <div class="panel panel-default">
      <div class="panel-heading">Class Details</div>
      <div class="panel-body">
        <dl>
          <dt>Term</dt>
          <dd>{{ courseschedule.Term.Number }} / {{ courseschedule.Term.Year }}</dd>
          <dt>Course</dt>
          <dd>{{ courseschedule.Course.CourseLevel.Name }}{{ courseschedule.Suffix ? (' - ' + courseschedule.Suffix) : '' }}</dd>
          <dt>Code</dt>
          <dd>{{ courseschedule.Course.CourseLevel.Code }}{{ courseschedule.Suffix ? (' - ' + courseschedule.Suffix) : '' }}</dd>
          <dt>Date</dt>
          <dd>{{ courseschedule.StartDate | date: 'mediumDate'  }} - {{ courseschedule.EndDate | date: 'mediumDate' }}</dd>
          <dt>Time</dt>
          <dd>{{ courseschedule.TimeClass.StartTime | date: 'shortTime'  }} - {{ courseschedule.TimeClass.EndTime | date: 'shortTime' }}</dd>
          <dt>Day</dt>
          <dd>{{ courseschedule.DayClass.DayRange }}</dd>
          <dt>Class Type</dt>
          <dd>{{ TeacherTypes[courseschedule.Course.TeacherType].Code }}</dd>
          <dt>Teachers</dt>
          <dd ng-if="courseschedule.Staffs.length < 1">-</dd>
          <dd ng-repeat="teacher in courseschedule.Staffs">{{ teacher.Name }}</dd>
          <dt>Total Registered</dt>
          <dd>{{ registered.length }}</dd>
          <dt>Total Waiting List</dt>
          <dd>{{ waitingList.length }}</dd>
          <dt>Cancel/Move</dt>
          <dd>{{ cancelled.length }}</dd>
          <dt>Total</dt>
          <dd>{{ courseschedule.EnrollmentCount }}</dd>
        </dl>
        <a href ui-sref="classes.show.assessment({ id: courseschedule.Id })">Assessment</a>
        &nbsp
        <a href ui-sref="courseSchedules.activities({ id: courseschedule.Id })">Activities</a>
      </div>
    </div>
  </div>

</div>

<pageslide ps-size="550px" ps-speed="0.25" ps-auto-close="true" ps-open="cancelForm">
  <div style="padding:20px">
    <h3>Class Cancellation Form <a href="" ng-click="cancelForm = !cancelForm"><i class="simple-icon-close"></i></a></h3>
    <hr>

    <div class="alert" ng-class="errors.MessageType" ng-show="errors.RefundType">
      <button type="button" class="close" ng-click="errors = {}">&times;</button>
      {{ (errors.Message == '') ? errors.RefundType[0] : errors.Message }}
    </div>

    <form name="termForm" role="form" ng-submit="submitCancellation()">

      <!-- <p>
        <small>This is the cancellation form for <b>{{ refundCancel.Enrollment.Student.FullName }}</b> with the course code <b>{{ courseschedule.Course.CourseLevel.Code }} / {{ courseschedule.Course.CourseLevel.Name }}</b>. Please confirm the details before submitting this form.</small>
      </p> -->

      <div class="row">
        <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8">
          <div class="form-group" ng-click="openDatepicker($event, 0)">
            <div class="input-group">
              <input type="hidden" class="form-control" datepicker-popup="{{format}}" ng-model="timepicker.timeA" is-open="datePicker.isOpen[0]" datepicker-options="dateOptions" ng-required="true" close-text="Close" ng-disabled="true" />
              <span class="form-control">{{ timepicker.timeA | date: 'dd MMMM yyyy' }}</span>
              <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
            </div>
          </div>
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
          <button type="button" class="btn btn-info" ng-click="checkRefundCancel()">Check</button>
        </div>
      </div>

      <h5>Student</h5>
      <table class="table table-condensed">
        <tbody>
          <tr>
            <th><small>Name</small></th>
            <td><small>{{ refundCancel.Enrollment.Student.FullName }}</small></td>
          </tr>
          <tr>
            <th><small>SID</small></th>
            <td><small>{{ refundCancel.Enrollment.Student.SID }}</small></td>
          </tr>
        </tbody>
      </table>

      <h5>Course Schedule</h5>
      <table class="table table-condensed">
        <tbody>
          <!-- <tr>
            <th><small>Course Name</small></th>
            <td><small>{{ courseschedule.Course.CourseLevel.Code }} / {{ courseschedule.Suffix }}</small></td>
          </tr> -->
          <tr>
            <th><small>Course Name</small></th>
            <td><small>{{ courseschedule.CourseName }}</small></td>
          </tr>
          <tr>
            <th><small>Term</small></th>
            <td><small>{{ courseschedule.Term.Number }}/{{ courseschedule.Term.Year }}</small></td>
          </tr>
          <tr>
            <th><small>Price</small></th>
            <td class="text-right"><small>{{ courseschedule.Course.CourseFee.Fee | currency: 'Rp. ' }}</small></td>
          </tr>
          <tr>
            <th><small>Discount</small></th>
            <td class="text-right"><small>{{ refundCancel.Enrollment.Invoice.TotalDiscount | currency: 'Rp. ' }}</small></td>
          </tr>
          <tr>
            <th><small>Paid</small></th>
            <td class="text-right"><small>{{ (refundCancel.Enrollment.Invoice.TotalAmount - refundCancel.Enrollment.Invoice.TotalDiscount) | currency: 'Rp. ' }}</small></td>
          </tr>
        </tbody>
      </table>

      <h5>Cancelation Details</h5>
      <table class="table table-condensed" ng-show="refundCancel.IsRefundable">
        <tbody>
          <tr>
            <th><small>Refund Type</small></th>
            <td>
              <ul>
                <li><small><b>Type: </b>{{ refundCancel.Type.Name }}</small></li>
                <li><small><b>Percentage: </b>{{ refundCancel.Type.Percentage }} %</small></li>
                <li><small><b>Nominal: </b><span ng-if="refundCancel.Type.Nominal < 0">(-) </span>{{ refundCancel.Type.Nominal | currency: 'Rp. ' }}</small></li>
              </ul>
            </td>
          </tr>
          <tr>
            <th><small>Paid</small></th>
            <td class="text-right"><small>{{ (refundCancel.Enrollment.Invoice.TotalAmount - refundCancel.Enrollment.Invoice.TotalDiscount) | currency: 'Rp. ' }}</small></td>
          </tr>
          <tr>
            <th><small>Cancellation Fee (<b ng-if="refundCancel.Type.Percentage > 0">{{ refundCancel.Type.Percentage }}%</b> <span ng-if="(refundCancel.Type.Percentage > 0) && (refundCancel.Type.Nominal != 0) ">+</span> <b ng-if="refundCancel.Type.Nominal != 0">adm. {{ refundCancel.NominalTemp | currency: 'Rp. ' }}</b>) </small></th>
            <td class="text-right"><small>{{ (((refundCancel.Enrollment.Invoice.TotalAmount - refundCancel.Enrollment.Invoice.TotalDiscount)*(refundCancel.Type.Percentage/100)) - refundCancel.Type.Nominal) | currency:'Rp. ' }}</small></td>
          </tr>
          <tr>
            <th><small>Balance</small></th>
            <td class="text-right">
              <small><span ng-if="(balanceCancel()) < 0">(-) </span></small>
              <small>{{ (absThis(balanceCancel())) | currency:'Rp. ' }}</small>
            </td>
          </tr>
          <tr>
            <td colspan="2" class="text-right">
              <small ng-if="(balanceCancel()) != 0"><em>*{{ ((balanceCancel()) > 0) ? 'Student will get ' + (absThis(balanceCancel()) | currency: 'Rp. ') + ' as a refund' : 'Student must pay another ' + (balanceCancel() | currency: 'Rp. ') + ' to match the refund' }}</em></small>
              <!-- <small><em>*Student will get {{ (absThis(balanceCancel())) | currency:'Rp. ' }} as a refund</em></small> -->
              <small ng-if="(balanceCancel()) == 0"><em>*Student gets <b>No Refund</b></em></small>
            </td>
          </tr>
        </tbody>
      </table>
      <div class="alert alert-info" ng-hide="refundCancel.IsRefundable">
        <strong>Sorry!</strong> Refund is not available for this combination of student and date
      </div>


      <button type="submit" class="btn btn-primary" ng-show="refundCancel.IsRefundable">Submit</button>
      <button type="button" class="btn btn-info" ng-click="cancelForm = !cancelForm">Cancel</button>
    </form>
  </div>
</pageslide>

<pageslide ps-size="550px" ps-speed="0.25" ps-auto-close="true" ps-open="moveForm">
  <div style="padding:20px">
    <h3>Class Mutation Form <a href="" ng-click="moveForm = !moveForm"><i class="simple-icon-close"></i></a></h3>
    <hr>

    <div class="alert" ng-class="errors.MessageType" ng-show="errors.RefundType">
      <button type="button" class="close" ng-click="errors = {}">&times;</button>
      {{ (errors.Message == '') ? errors.RefundType[0] : errors.Message }}
    </div>

    <form name="termForm" role="form" ng-submit="submitMutation()">

      <!-- <p>
        <small>This is the class mutation form for <b>{{ refundMove.Enrollment.Student.FullName }}</b> with the course code <b>{{ courseschedule.Course.CourseLevel.Code }} / {{ courseschedule.Course.CourseLevel.Name }}</b>. Please confirm the details before submitting this form.</small>
      </p> -->

      <div class="row">
        <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8">
          <div class="form-group" ng-click="openDatepicker($event, 0)">
            <div class="input-group">
              <input type="hidden" class="form-control" datepicker-popup="{{format}}" ng-model="timepicker.timeA" is-open="datePicker.isOpen[0]" datepicker-options="dateOptions" ng-required="true" close-text="Close" ng-disabled="true" />
              <span class="form-control">{{ timepicker.timeA | date: 'dd MMMM yyyy' }}</span>
              <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
            </div>
          </div>
        </div>
        <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
          <button type="button" class="btn btn-info btn-block" ng-click="loadTerm()">Load Courses</button>
        </div>
      </div>

      <h5>Student</h5>
      <table class="table table-condensed">
        <tbody>
          <tr>
            <th><small>Name</small></th>
            <td><small>{{ refundMove.Enrollment.Student.FullName }}</small></td>
          </tr>
          <tr>
            <th><small>SID</small></th>
            <td><small>{{ refundMove.Enrollment.Student.SID }}</small></td>
          </tr>
        </tbody>
      </table>

      <h5>Source</h5>
      <table class="table table-condensed">
        <tbody>
          <!-- <tr>
            <th><small>Course Name</small></th>
            <td><small>{{ courseschedule.Course.CourseLevel.Code }} / {{ courseschedule.Suffix }}</small></td>
          </tr> -->
          <tr>
            <th><small>Course Name</small></th>
            <td><small>{{ courseschedule.CourseName }}</small></td>
          </tr>
          <tr>
            <th><small>Instructors</small></th>
            <td><span ng-hide="courseschedule.Staffs > 0">-</span><p ng-repeat="staff in courseschedule.Staffs"><small>- {{ staff.Code }} - {{ staff.Name }}</small></p></td>
          </tr>
          <tr>
            <th><small>Start Date</small></th>
            <td><small>{{ courseschedule.StartDate }}</small></td>
          </tr>
          <tr>
            <th><small>Term</small></th>
            <td><small>{{ courseschedule.Term.Number }}/{{ courseschedule.Term.Year }}</small></td>
          </tr>
          <tr>
            <th><small>Price</small></th>
            <td class="text-right"><small>{{ courseschedule.Course.CourseFee.Fee | currency: 'Rp. ' }}</small></td>
          </tr>
          <tr>
            <th><small>Discount</small></th>
            <td class="text-right"><small>{{ refundMove.Enrollment.Invoice.TotalDiscount | currency: 'Rp. ' }}</small></td>
          </tr>
          <tr>
            <th><small>Paid</small></th>
            <td class="text-right"><small>{{ (refundMove.Enrollment.Invoice.TotalAmount - refundMove.Enrollment.Invoice.TotalDiscount) | currency: 'Rp. ' }}</small></td>
          </tr>
        </tbody>
      </table>

      <h5>Destination</h5>
      <table class="table table-condensed">
        <tbody>
          <tr>
            <th><small>Course</small></th>
            <td>
              <div class="form-group" ng-class="{ 'has-error': errors.CourseScheduleTarget}">
                <select name="CourseScheduleTarget" class="form-control" id="CourseScheduleTarget" ng-model="refundMove.CourseScheduleTarget" ng-options="schedule as schedule.CourseName group by schedule.TypeGroup for schedule in moveSchedules" ng-disabled="moveSchedules < 1" required>
                  <option value="" ng-hide="refundMove.CourseScheduleTarget">Select a Course Target</option>
                </select>
                <error-widget field="errors.CourseScheduleTarget"></error-widget>
              </div>
              <div class="row">
                <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
                  <button type="button" class="btn btn-primary btn-block" ng-click="checkRefundMove()" ng-disabled="!refundMove.CourseScheduleTarget">Check Refundable</button>
                </div>
              </div>
            </td>
          </tr>
          <tr>
            <th><small>Instructors</small></th>
            <td><span ng-hide="refundMove.CourseScheduleTarget.Staffs > 0">-</span><p ng-repeat="staff in refundMove.CourseScheduleTarget.Staffs"><small>- {{ staff.Code }} - {{ staff.Name }}</small></p></td>
          </tr>
          <tr>
            <th><small>Start Date</small></th>
            <td><small>{{ refundMove.CourseScheduleTarget.StartDate }}</small></td>
          </tr>
          <tr>
            <th><small>Term</small></th>
            <td><small>{{ refundMove.CourseScheduleTarget.Term.Number }}/{{ refundMove.CourseScheduleTarget.Term.Year }}</small></td>
          </tr>
          <tr>
            <th><small>Price</small></th>
            <td class="text-right"><small>{{ refundMove.CourseScheduleTarget.Course.CourseFee.Fee | currency: 'Rp. ' }}</small></td>
          </tr>
        </tbody>
      </table>

      <h5>Move Details</h5>
      <table class="table table-condensed" ng-show="refundMove.IsRefundable">
        <tbody>
          <tr>
            <th><small>Refund Type</small></th>
            <td>
              <ul>
                <li><small><b>Type: </b>{{ refundMove.Type.Name }}</small></li>
                <li><small><b>Percentage: </b>{{ refundMove.Type.Percentage }} %</small></li>
                <li><small><b>Nominal: </b><span ng-if="refundMove.Type.Nominal < 0">(-) </span>{{ refundMove.Type.Nominal | currency: 'Rp. ' }}</small></li>
              </ul>
            </td>
          </tr>
          <tr>
            <th><small>Source Balance</small></th>
            <td class="text-right"><small>{{ (refundMove.Enrollment.Invoice.TotalAmount - refundMove.Enrollment.Invoice.TotalDiscount) | currency: 'Rp. ' }}</small></td>
          </tr>
          <tr>
            <th><small>Destination Balance</small></th>
            <td class="text-right"><small>{{ refundMove.CourseScheduleTarget.Course.CourseFee.Fee | currency: 'Rp. ' }}</small></td>
          </tr>
          <tr>
            <th><small>Balance</small></th>
            <td class="text-right">
              <small><span ng-if="(balanceMove()) < 0">(-) </span></small>
              <small>{{ (absThis(balanceMove())) | currency:'Rp. ' }}</small>
            </td>
          </tr>
          <tr>
            <td colspan="2" class="text-right">
              <small ng-if="(balanceMove()) != 0"><em>*{{ ((balanceMove()) < 0) ? 'Student will get ' + (absThis(balanceMove()) | currency: 'Rp. ') + ' as a refund' : 'Student must pay another ' + (balanceMove() | currency: 'Rp. ') + ' to match the refund' }}</em></small>
              <small ng-if="(balanceMove()) == 0"><em>*Student gets <b>No Refund</b></em></small>
            </td>
          </tr>
        </tbody>
      </table>
      <div class="alert alert-info" ng-hide="refundMove.IsRefundable">
        <strong>Sorry!</strong> Refund is not available for this combination of student, course target and date
      </div>

      <button type="submit" class="btn btn-primary" ng-show="refundMove.IsRefundable">Submit</button>
      <button type="button" class="btn btn-info" ng-click="moveForm = !moveForm">Cancel</button>
    </form>
  </div>
</pageslide>

<pageslide ps-size="100%" ps-speed="0.25" ps-auto-close="true" ps-open="cancelBatchForm">
  <div style="padding:20px">
    <h3>Class Cancel Batch Form <a href="" ng-click="cancelBatchForm = !cancelBatchForm"><i class="simple-icon-close"></i></a></h3>
    <hr>

    <div class="alert" ng-class="errors.MessageType" ng-show="errors.RefundType">
      <button type="button" class="close" ng-click="errors = {}">&times;</button>
      {{ (errors.Message == '') ? errors.RefundType[0] : errors.Message }}
    </div>
    <div class="row">
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
        <h4>Course Schedule</h4>
        <table class="table table-condensed">
          <tbody>
            <!-- <tr>
              <th><small>Course Name</small></th>
              <td><small>{{ courseschedule.Course.CourseLevel.Code }} / {{ courseschedule.Suffix }}</small></td>
            </tr> -->
            <tr>
              <th><small>Course Name</small></th>
              <td><small>{{ courseschedule.CourseName }}</small></td>
            </tr>
            <tr>
              <th><small>Instructors</small></th>
              <td><span ng-hide="courseschedule.Staffs > 0">-</span><p ng-repeat="staff in courseschedule.Staffs"><small>- {{ staff.Code }} - {{ staff.Name }}</small></p></td>
            </tr>
          </tbody>
        </table>
      </div>
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
        <div class="row">
          <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8">
            <div class="form-group" ng-click="openDatepicker($event, 0)">
              <div class="input-group">
                <input type="hidden" class="form-control" datepicker-popup="{{format}}" ng-model="timepicker.timeA" is-open="datePicker.isOpen[0]" datepicker-options="dateOptions" ng-required="true" close-text="Close" ng-disabled="true" />
                <span class="form-control">{{ timepicker.timeA | date: 'dd MMMM yyyy' }}</span>
                <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
              </div>
            </div>
          </div>
          <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <button type="button" class="btn btn-info" ng-click="checkRefundCancelBatch()">Check</button>
          </div>
        </div>
      </div>
    </div>

    <table class="table table-hover table-bordered table-condensed">
      <thead>
        <tr>
          <th rowspan="2" class="text-center">No</th>
          <th rowspan="2" class="text-center">Name</th>
          <th rowspan="2" class="text-center">SID</th>
          <th rowspan="2" class="text-center">Amount Paid</th>
          <th rowspan="2" class="text-center">Refund Type</th>
          <th rowspan="2" class="text-center">Balance</th>
          <th rowspan="2" class="text-center">Refund Note</th>
          <th colspan="2" class="text-center">Refunder</th>
        </tr>
        <tr>
          <th class="text-center">Student</th>
          <th class="text-center">IALF</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="refundCancel in refundCancelBatch">
          <td>{{ $index+1 }}</td>
          <td>{{ refundCancel.Enrollment.Student.FullName }}</td>
          <td>{{ refundCancel.Enrollment.Student.SID }}</td>
          <td>{{ (refundCancel.Enrollment.Invoice.TotalAmount - refundCancel.Enrollment.Invoice.TotalDiscount) | currency: 'Rp. ' }}</td>
          <td>
            <ul>
              <li><small><b>Type: </b>{{ refundCancel.Type.Name }}</small></li>
              <li><small><b>Percentage: </b>{{ refundCancel.Type.Percentage }} %</small></li>
              <li><small><b>Nominal: </b><span ng-if="refundCancel.Type.Nominal < 0">(-) </span>{{ refundCancel.Type.Nominal | currency: 'Rp. ' }}</small></li>
            </ul>
          </td>
          <td>
            {{ (absThis(balanceCancelBatch(refundCancel))) | currency: 'Rp. ' }}
            <br>
            <small ng-if="(balanceCancelBatch(refundCancel)) != 0"><em>*{{ ((balanceCancelBatch(refundCancel)) > 0) ? 'Student will get ' + (absThis(balanceCancelBatch(refundCancel)) | currency: 'Rp. ') + ' as a refund' : 'Student must pay another ' + (balanceCancelBatch(refundCancel) | currency: 'Rp. ') + ' to match the refund' }}</em></small>
            <!-- <small><em>*Student will get {{ (absThis(balanceCancelBatch(refundCancel))) | currency:'Rp. ' }} as a refund</em></small> -->
            <small ng-if="(balanceCancelBatch(refundCancel)) == 0"><em>*Student gets <b>No Refund</b></em></small>
          </td>
          <td><input type="text" class="form-control" ng-model="refundCancel.Note"></td>
          <td><input type="radio" value="0" ng-model="refundCancel.RefundInitiator"></td>
          <td><input type="radio" value="1" ng-model="refundCancel.RefundInitiator"></td>
        </tr>
      </tbody>
    </table>
    <button type="button" class="btn btn-primary" ng-click="submitCancellationBatch()">Submit</button>

  </div>
</pageslide>

<pageslide ps-size="100%" ps-speed="0.25" ps-auto-close="true" ps-open="moveBatchForm">
  <div style="padding:20px">
    <h3>Class Move Batch Form <a href="" ng-click="moveBatchForm = !moveBatchForm"><i class="simple-icon-close"></i></a></h3>
    <hr>

    <div class="alert" ng-class="errors.MessageType" ng-show="errors.RefundType">
      <button type="button" class="close" ng-click="errors = {}">&times;</button>
      {{ (errors.Message == '') ? errors.RefundType[0] : errors.Message }}
    </div>
    <div class="row">
      <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8">
        <h5>Filtering Setting</h5>
        <div class="row">
          <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8">
            <div class="form-group" ng-click="openDatepicker($event, 0)">
              <div class="input-group">
                <input type="hidden" class="form-control" datepicker-popup="{{format}}" ng-model="timepicker.timeA" is-open="datePicker.isOpen[0]" datepicker-options="dateOptions" ng-required="true" close-text="Close" ng-disabled="true" />
                <span class="form-control">{{ timepicker.timeA | date: 'dd MMMM yyyy' }}</span>
                <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
              </div>
            </div>
          </div>
          <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
            <button type="button" class="btn btn-primary" ng-click="loadTerm()">Load Course</button>
          </div>
        </div>
        <p class="text-muted">Please click the check button everytime you made changes to the refund Settings.</p>
      </div>
    </div>
    <div class="row">
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
        <h5>Course Schedule</h5>
        <table class="table table-condensed">
          <tbody>
            <!-- <tr>
              <th><small>Course Name</small></th>
              <td><small>{{ courseschedule.Course.CourseLevel.Code }} / {{ courseschedule.Suffix }}</small></td>
            </tr> -->
            <tr>
              <th><small>Course Name</small></th>
              <td><small>{{ courseschedule.CourseName }}</small></td>
            </tr>
            <tr>
              <th><small>Instructors</small></th>
              <td><span ng-hide="courseschedule.Staffs > 0">-</span><p ng-repeat="staff in courseschedule.Staffs"><small>- {{ staff.Code }} - {{ staff.Name }}</small></p></td>
            </tr>
          </tbody>
        </table>
      </div>
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
        <h5>Destination</h5>
        <table class="table table-condensed">
          <tbody>
            <tr>
              <th><small>Course Name</small></th>
              <td>
                <div class="form-group" ng-class="{ 'has-error': errors.CourseScheduleTarget}">
                  <select name="CourseScheduleTarget" class="form-control" id="CourseScheduleTarget" ng-model="refundMoveBatchCourseScheduleTarget" ng-options="schedule as schedule.CourseName group by schedule.TypeGroup for schedule in moveSchedules" ng-disabled="moveSchedules.length < 1" required>
                    <option value="" ng-hide="refundMoveBatchCourseScheduleTarget">Select a Course Target</option>
                  </select>
                  <error-widget field="errors.CourseScheduleTarget"></error-widget>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                  <button type="button" class="btn btn-info" ng-click="checkRefundMoveBatch()">Check Refundable</button>
                </div>
              </td>
            </tr>
            <tr>
              <th><small>Instructors</small></th>
              <td><span ng-hide="refundMoveBatchCourseScheduleTarget.Staffs > 0">-</span><p ng-repeat="staff in refundMoveBatchCourseScheduleTarget.Staffs"><small>- {{ staff.Code }} - {{ staff.Name }}</small></p></td>
            </tr>
            <tr>
              <th><small>Start Date</small></th>
              <td><small>{{ refundMoveBatchCourseScheduleTarget.StartDate }}</small></td>
            </tr>
            <tr>
              <th><small>Term</small></th>
              <td><small>{{ refundMoveBatchCourseScheduleTarget.Term.Number }}/{{ refundMoveBatchCourseScheduleTarget.Term.Year }}</small></td>
            </tr>
            <tr>
              <th><small>Price</small></th>
              <td class="text-right"><small>{{ refundMoveBatchCourseScheduleTarget.Course.CourseFee.Fee | currency: 'Rp. ' }}</small></td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>

    <table class="table table-hover table-bordered table-condensed">
      <thead>
        <tr>
          <th rowspan="2" class="text-center">No</th>
          <th rowspan="2" class="text-center">Name</th>
          <th rowspan="2" class="text-center">SID</th>
          <th rowspan="2" class="text-center">Amount Paid</th>
          <th rowspan="2" class="text-center">Refund Type</th>
          <th rowspan="2" class="text-center">Balance</th>
          <th rowspan="2" class="text-center">Refund Note</th>
          <th colspan="2" class="text-center">Refunder</th>
        </tr>
        <tr>
          <th class="text-center">Student</th>
          <th class="text-center">IALF</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="refundMove in refundMoveBatch">
          <td>{{ $index+1 }}</td>
          <td>{{ refundMove.Enrollment.Student.FullName }}</td>
          <td>{{ refundMove.Enrollment.Student.SID }}</td>
          <td>{{ (refundMove.Enrollment.Invoice.TotalAmount - refundMove.Enrollment.Invoice.TotalDiscount) | currency: 'Rp. ' }}</td>
          <td>
            <ul>
              <li><small><b>Type: </b>{{ refundMove.Type.Name }}</small></li>
              <li><small><b>Percentage: </b>{{ refundMove.Type.Percentage }} %</small></li>
              <li><small><b>Nominal: </b><span ng-if="refundMove.Type.Nominal < 0">(-) </span>{{ refundMove.Type.Nominal | currency: 'Rp. ' }}</small></li>
            </ul>
          </td>
          <td>
            {{ (absThis(balanceMoveBatch(refundMove))) | currency: 'Rp. ' }}
            <br>
            <small ng-if="(balanceMoveBatch(refundMove)) != 0"><em>*{{ ((balanceMoveBatch(refundMove)) < 0) ? 'Student will get ' + (absThis(balanceMoveBatch(refundMove)) | currency: 'Rp. ') + ' as a refund' : 'Student must pay another ' + (balanceMoveBatch(refundMove) | currency: 'Rp. ') + ' to match the refund' }}</em></small>
              <small ng-if="(balanceMoveBatch(refundMove)) == 0"><em>*Student gets <b>No Refund</b></em></small>
          </td>
          <td><input type="text" class="form-control" ng-model="refundMove.Note"></td>
          <td><input type="radio" value="0" ng-model="refundMove.RefundInitiator"></td>
          <td><input type="radio" value="1" ng-model="refundMove.RefundInitiator"></td>
        </tr>
      </tbody>
    </table>
    <button type="button" class="btn btn-primary" ng-click="submitMutationBatch()">Submit</button>

  </div>
</pageslide>